<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>考生抽签</title>

    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="font-awesome/css/font-awesome.css" rel="stylesheet">
    <link href="css/plugins/dataTables/datatables.min.css" rel="stylesheet">
    <link href="css/animate.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

</head>

<body>

<div id="wrapper">


    <!--引入公共页面-->
    <div th:replace="common/sidebar::sidebar(activeUri='examee-drawlots')"></div>
    <!--当前用户的账户信息-->
    <input type="hidden" id="current_user" th:value="${session.userAccount}">

    <div id="page-wrapper" class="gray-bg">
        <div class="row border-bottom">
            <nav class="navbar navbar-static-top white-bg" role="navigation" style="margin-bottom: 0">
                <div class="navbar-header">
                    <a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i class="fa fa-bars"></i> </a>
                    <form role="search" class="navbar-form-custom" method="post" action="#">
                        <div class="form-group">
                            <input type="text" placeholder="Search for something..." class="form-control" name="top-search" id="top-search">
                        </div>
                    </form>
                </div>
                <ul class="nav navbar-top-links navbar-right">
                    <li>
                        <a href="#">
                            <i class="fa fa-sign-out"></i> Log out
                        </a>
                    </li>
                </ul>

            </nav>
        </div>
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox ">
                        <div class="ibox-title">
                            <h5>考生抽签步骤</h5>
                            <div class="ibox-tools">
                                <a class="collapse-link">
                                    <i class="fa fa-chevron-up"></i>
                                </a>
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                    <i class="fa fa-wrench"></i>
                                </a>

                            </div>
                        </div>
                        <div class="ibox-content">
                            <div class="alert alert-success">
                                【第一步：生成 抽签池】 <a class="alert-link" href="#" id="text_DrawLotPoolState"></a>
                                 &nbsp;&nbsp;&nbsp<button class="btn btn-primary"  id="btn_generateDrawLotPool">生成抽签池</button>
                                &nbsp;&nbsp;&nbsp<button class="btn btn-primary"  id="btn_clearDrawLotPool">清空抽签池</button>

                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-12">
                    <div class="ibox ">
                        <div class="ibox-title">
                            <h5>考生抽签列表</h5>
                            <button class="btn btn-success btn-xs" type="button"  onclick="batchDrawLots()"><i class="fa fa-plus"></i>&nbsp;&nbsp;<span class="bold">一键抽签</span></button>

                            <div class="ibox-tools">
                                <a class="collapse-link">
                                    <i class="fa fa-chevron-up"></i>
                                </a>
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                    <i class="fa fa-wrench"></i>
                                </a>
                                <ul class="dropdown-menu dropdown-user">
                                    <li><a href="#" class="dropdown-item">Config option 1</a>
                                    </li>
                                    <li><a href="#" class="dropdown-item">Config option 2</a>
                                    </li>
                                </ul>
                                <a class="close-link">
                                    <i class="fa fa-times"></i>
                                </a>
                            </div>
                        </div>
                        <div class="ibox-content">
                            <div class="table-responsive">
                                <table class="table table-striped table-bordered table-hover dataTables-example" id="table_examee">
                                    <thead>
                                    <tr>
                                        <th>身份证号</th>
                                        <th>姓名</th>
                                        <th>所属组号</th>
                                        <th>抽签号</th>
                                        <th>操作</th>

                                    </tr>
                                    </thead>
                                    <tbody>

                                    </tbody>
                                    <tfoot>
                                    </tfoot>
                                </table>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="footer">
            <div class="pull-right">
                10GB of <strong>250GB</strong> Free.
            </div>
            <div>
                <strong>Copyright</strong> Example Company &copy; 2014-2018
            </div>
        </div>

    </div>
</div>
<!--考生签到的模态框-->
<div class="modal inmodal fade" id="modal_addExamee" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">考生签到</h4>
            </div>
            <div class="modal-body">
                <div class="ibox-content">
                    <form id="form_ExaminerInfo">
                        <div class="form-group row"><label class="col-lg-3 col-form-label">身份证号</label>
                            <div class="col-lg-9">
                                <input type="text" name="idNumber" id="idNumber">
                                <span class="form-text m-b-none"></span>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="sign()">确定</button>
            </div>
        </div>
    </div>
</div>
<!--Mainly scripts-->
<script type="text/javascript" th:src="@{js/jquery-3.1.1.min.js}"></script>
<script type="text/javascript" th:src="@{js/popper.min.js}"></script>
<script type="text/javascript" th:src="@{js/bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{js/plugins/metisMenu/jquery.metisMenu.js}"></script>
<script type="text/javascript" th:src="@{js/plugins/slimscroll/jquery.slimscroll.min.js}"></script>

<script type="text/javascript" th:src="@{js/plugins/dataTables/datatables.min.js}"></script>
<script type="text/javascript" th:src="@{js/plugins/dataTables/dataTables.bootstrap4.min.js}"></script>

<!-- Custom and plugin javascript -->
<script type="text/javascript" th:src="@{js/inspinia.js}"></script>
<script type="text/javascript" th:src="@{js/plugins/pace/pace.min.js}"></script>

<!-- Page-Level Scripts -->
<script>


    var signedTable= $("#table_examee").DataTable({
        pageLength: 25,
        responsive: true,
        ajax:{
            url:"/drawLots/getDrawLotNumberWithSignedInfo",
            type:"POST",
            dataSrc:function (result) {
                var examinerList=result.data;
                return examinerList;
            }
        },
        bAutoWidth: true,
        dom: '<"html5buttons"B>lTfgitp',
        buttons: [{
            extend: 'excel',
            title: 'ExampleFile'
        },
            {
                extend: 'pdf',
                title: 'ExampleFile'
            },

            {
                extend: 'print',
                customize: function(win) {
                    $(win.document.body).addClass('white-bg');
                    $(win.document.body).css('font-size', '10px');

                    $(win.document.body).find('table')
                        .addClass('compact')
                        .css('font-size', 'inherit');
                }
            }
        ],
        columns: [
            { data: 'idNumber' },
            { data: 'name' },
            { data: 'groupId' },
            { data: 'drawLotsNumber' },
            {"data":null,"render":function (data,type,row,meta) {
                    var idNumber = '"' + row.idNumber + '"';
                    var name='"' + row.name + '"';
                    var groupId='"' + row.groupId + '"';
                    return "<button type='button' class='btn btn-danger btn-sm' onclick='drawLots("+idNumber+","+name+","+groupId+")'>抽签</button>";
                }}
        ]
    });


    function addExamineeModal(){
        //弹出模态框
        $("#modal_addExamee").modal({
            backdrop:"static"
        });
    }


    //获取抽签进度
    $.ajax({
        url:"/schedule/getScheduleList",
        type:"POST",
        success:function (result) {
            let tag=result.flag;
            if (tag===true){
                $("#text_DrawLotPoolState").text("已生成抽签池");
                $("#btn_generateDrawLotPool").hide();
            }else {
                $("#text_DrawLotPoolState").text("未生成抽签池")
                $("#btn_clearDrawLotPool").hide();
            }
        }
    });

    //生成抽签池
    $("#btn_generateDrawLotPool").click(function () {
        $.ajax({
            url:"/schedule/generateExameeDrawLotsPool",
            type:"POST",
            success:function (result) {
                let tag=result.flag;
                alert(result.message);
                window.location.reload();
            }
        });
    });
    //清空抽签池
    $("#btn_clearDrawLotPool").click(function () {
        $.ajax({
            url:"/schedule/clearExameeDrawLotsPool",
            type:"POST",
            success:function (result) {
                alert(result.message);
                window.location.reload();
            }
        });
    })

    //一键抽签到
    function batchDrawLots() {
        $.ajax({
            url:"/drawLots/generateDrawLotsNumber",
            type:"POST",
            success:function (result) {
                alert(result.message);
                signedTable.ajax.reload();
            }
        });
    }
</script>

</body>

</html>
